import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import '../widgets/sidebar.dart';
import '../widgets/note_list.dart';
import '../widgets/note_editor.dart';
import '../widgets/notification_overlay.dart';
import '../../core/providers/app_providers.dart';

/**
 * 主屏幕组件
 * 包含侧边栏、笔记列表和编辑器的三栏布局
 */
class HomeScreen extends ConsumerWidget {
  const HomeScreen({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final showSettings = ref.watch(showSettingsProvider);
    
    return Scaffold(
      body: Stack(
        children: [
          Row(
            children: [
              // 侧边栏
              const SizedBox(
                width: 280,
                child: Sidebar(),
              ),
              
              // 分割线
              Container(
                width: 1,
                color: Theme.of(context).dividerColor,
              ),
              
              // 笔记列表
              const SizedBox(
                width: 320,
                child: NoteList(),
              ),
              
              // 分割线
              Container(
                width: 1,
                color: Theme.of(context).dividerColor,
              ),
              
              // 笔记编辑器
              const Expanded(
                child: NoteEditor(),
              ),
            ],
          ),
          
          // 设置面板覆盖层
          if (showSettings)
            Container(
              color: Colors.black.withOpacity(0.3),
              child: Center(
                child: Container(
                  width: 600,
                  height: 500,
                  decoration: BoxDecoration(
                    color: Theme.of(context).scaffoldBackgroundColor,
                    borderRadius: BorderRadius.circular(12),
                    boxShadow: [
                      BoxShadow(
                        color: Colors.black.withOpacity(0.2),
                        blurRadius: 20,
                        offset: const Offset(0, 10),
                      ),
                    ],
                  ),
                  child: Column(
                    children: [
                      // 设置面板标题栏
                      Container(
                        padding: const EdgeInsets.all(16),
                        decoration: BoxDecoration(
                          border: Border(
                            bottom: BorderSide(
                              color: Theme.of(context).dividerColor,
                            ),
                          ),
                        ),
                        child: Row(
                          children: [
                            const Text(
                              '设置',
                              style: TextStyle(
                                fontSize: 18,
                                fontWeight: FontWeight.w600,
                              ),
                            ),
                            const Spacer(),
                            IconButton(
                              onPressed: () {
                                ref.read(showSettingsProvider.notifier).hide();
                              },
                              icon: const Icon(Icons.close),
                            ),
                          ],
                        ),
                      ),
                      
                      // 设置内容
                      const Expanded(
                        child: Padding(
                          padding: EdgeInsets.all(16),
                          child: Text('设置面板内容待实现'),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ),
          
          // 通知覆盖层
          const NotificationOverlay(),
        ],
      ),
    );
  }
}